<template>
  <p-modal v-drag
    :title="title"
    :width="width"
    :visible="visible"
    @ok="handleOk"
    @cancel="close"
    cancelText="关闭"
  >
    <p-form-model ref="ruleForm" :model="form" :rules="rules">
      <p-row>
        <p-col :span="24">
          <p-row type="flex">
            <p-col :flex="3" :offset="2">
              <p-form-model-item
                ref="planName"
                label="员工编号"
                prop="uid"
                :labelCol="labelCol"
                :wrapperCol="wrapperCol"
              >
                <p-input-search
                  placeholder="请输入员工工号"
                  :span="14"
                  class="hideName"
                  disabled
                  v-model="form.uid"
                >
                </p-input-search>
              </p-form-model-item>
            </p-col>
            <p-col :flex="2">
              <p-button @click="onSearchDepUser('planName')">
                选择用户</p-button
              >
            </p-col>
          </p-row>
        </p-col>
        <p-col :span="24">
          <p-form-model-item
            label="员工姓名"
            :labelCol="labelCol"
            :wrapperCol="wrapperCol"
            prop="name"
          >
            <p-input
              placeholder="请输入员工姓名"
              disabled
              v-model="form.name"
            ></p-input>
          </p-form-model-item>
        </p-col>
       
        <p-col :span="24">
          <p-form-model-item
            label="工时量"
            :labelCol="labelCol"
            :wrapperCol="wrapperCol"
            prop="timeNumber"
          >
            <p-input
              v-model="form.timeNumber"
              placeholder="请输入工时量"
            ></p-input>
          </p-form-model-item>
        </p-col>
        <p-col :span="24">
          <p-form-model-item
            label="损失原因"
            :labelCol="labelCol"
            :wrapperCol="wrapperCol"
            prop="reason"
          >
            <p-input v-model="form.reason" placeholder="请输入损失原因"></p-input>
          </p-form-model-item>
        </p-col>
      </p-row>
    </p-form-model>
    <!-- 人员选择模块 -->
    <j-select-user-by-dep-modal
      ref="selectModal"
      :modal-width="1250"
      :multi="true"
      @ok="selectOK"
    />
  </p-modal>
</template>

<script>
import JSelectUserByDepModal from "./JSelectUserByDepModal";
import { httpAction } from "@/api/manage";
import { SubmitOnchangMixin } from "@/mixins/SubmitOnchangMixin";
import pick from "lodash.pick";

export default {
  name: "MesHrMonthlyEdDetailModal",
  mixins: [SubmitOnchangMixin],
  components: {
    JSelectUserByDepModal,
  },
  props: {
    mainId: {
      type: String,
      required: false,
      default: "",
    },
  },
  data() {
    return {
      form: {
        uid: "",
        name: "",
        timeNumber: "",
        reason: "",
	  },
	  list:{},
      title: "操作",
      width: 800,
      visible: false,
      model: {},
      labelCol: {
        xs: { span: 24 },
        sm: { span: 5 },
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 16 },
      },

      confirmLoading: false,
      validatorRules: {
        empno: {},
        empname: {},
        workroomname: {},
        workroomno: {},
        classname: {},
        classno: {},
        station: {},
        remark: {},
      },
      url: {},
      rules: {
        uid: [{ required: true, message: "请选择工号" }],
        name: [{ required: true, message: "请输入姓名" }],
        remark: [{ required: true, message: "请输入损失原因" }],
        timeNumber: [{ required: true, message: "请输入工时量" }],
        reason: [{ required: true, message: "请输入损失原因" }]
      },
    };
  },
  created() {},
  methods: {
    add() {
      this.edit({});
    },
    edit(record) {
      this.visible = true;
    },
    onSearchDepUser(value) {
      this.$refs.selectModal.showModal();
	},
	close(){
		this.visible = false;
	},
    handleOk() {
       this.$refs.ruleForm.validate((valid) => {
        if (valid) {
      this.list.manhourQty=this.form.timeNumber
      this.list.loseReason=this.form.reason
      this.visible = false;
      
      this.$emit('getlist',this.list)
        }
       })
    },
    selectOK(rows) {
	    this.list=rows
      this.form.uid = rows.empno;
      this.form.name = rows.empname;
    },
  },
};
</script>
